<?php
use yii\helpers\Html;
use yii\bootstrap\ActiveForm;

?>
<script>
    if(top!=self) if(self!=top) top.location=self.location;
</script>

<style type="text/css">
    .rounded{
        font-size: 14px;
    }
    .logintext {
        text-align: center;
    }
    .logintext .h1 {
        font-size: 28px;
    }
    .showError {
        position:relative;
    }
    .errorInfo {
        position: absolute;
        left: 13%;
        top: 126px;
        margin: 1px 30px -20px;
        padding: 15px;
        text-align: center;
        width: 240px;
        -webkit-transform: rotate(-20deg);
        -moz-transform: rotate(-20deg);
        -o-transform: rotate(-20deg);
        transform: rotate(-20deg);
        background: #fb645d;
        color: #fff;
        -webkit-border-radius: 40px;
        -moz-border-radius: 40px;
        -ms-border-radius: 40px;
        -o-border-radius: 40px;
        border-radius: 40px;
        letter-spacing: 2px;
    }
    .errorInfo:after {
        display: -moz-inline-stack;
        display: inline-block;
        vertical-align: middle;
        zoom: 1;
        position: absolute;
        bottom: 4px;
        right: -15px;
        content: "";
        width: 0;
        height: 0;
        font-size: 0;
        border-style: solid;
        border-width: 10px;
        border-color: transparent transparent transparent #fb645d;
        -webkit-transform: rotate(20deg);
        -moz-transform: rotate(20deg);
        -o-transform: rotate(20deg);
        transform: rotate(20deg);
    }
</style>
<section id="content" class="m-t-lg wrapper-md animated fadeInUp showOne" style="margin-top: 10%;" onkeydown="bindEnterKey(event)">
    <div id="msg_li" class="errorInfo" style="display: none;"></div>
    <div class="container aside-xl" >
        <div class="logintext">
            <span class="h1 font-bold">管理员登录</span>
        </div>
        <section class="m-b-lg">
            <header class="wrapper text-center">
                <strong></strong>
            </header>
            <!--        --><?php //$form = ActiveForm::begin(['id' => 'login-form','options'=> ['autocomplete'=> 'off','onkeydown' => 'bindEnterKey(event)']]); ?>
            <div id="msg_li" class="errorInfo" style="display: none"><i></i></div>
            <div class="form-group">
                <input type="text" placeholder="用户名" style="text-align: left; border-radius: 4px;" class="form-control rounded input-lg text-center no-border" name="LoginForm[username]" id="username" autocomplete="off">
            </div>
            <div class="form-group">
                <input type="password" placeholder="请输入您的密码" style="text-align: left; border-radius: 4px;"  class="form-control rounded input-lg text-center no-border" name="LoginForm[password]" id="password" autocomplete="off">
            </div>
            <div style="margin:0 0 10px; color:#c35d00;" id="error_box">
                <span id="error_tips"></span>
            </div>
            <input type='hidden' value="<?php echo Yii::$app->request->csrfToken; ?>" name='_csrf'/>
            <button type="submit" class="btn btn-lg btn-warning lt b-white b-2x btn-block btn-rounded" style="border-radius: 4px;" id="btn-login"><i class="icon-arrow-right pull-right"></i><span class="m-r-n-lg">登录</span></button>
            <div class="line line-dashed"></div>
            <!--        --><?php //ActiveForm::end(); ?>
        </section>
    </div>
</section>
<script>

    $(document).ready(function() {
        $('#btn-login').click(function(){
            var username = $("#username").val();
            var pass = $("#password").val();
            var _csrf = "<?php echo Yii::$app->request->csrfToken; ?>";
            if(validate()) {
                // 提交前检验
                var uri = "<?php echo \Yii::$app->urlManager->createUrl("site/login"); ?>";
                $.post(uri, {"LoginForm[username]":username, "LoginForm[password]":pass, "_csrf":_csrf}, function(rs){
                    if(rs.status == 0) {
                        window.location = "<?php \Yii::$app->urlManager->createUrl(['site/index']);?>";
                    } else {
                        showLoginMsg(rs.message);
                    }
                    return false;

                }, 'json');
            }

        });
    });

    function bindEnterKey(event){
        if(13 == event.keyCode){
            $('#btn-login').click();
        }
    }
    window.document.onkeydown = function(e) {
        if ('' == document.activeElement.id) {
            var e=e || event;
            var currKey=e.keyCode || e.which || e.charCode;
            if (8 == currKey) {
                return false;
            }
        }
    };

    var showLoginMsg = function(msg){
        $('.showOne').addClass('showError');
        $('#msg_li').html('<i></i>'+msg).fadeIn().show();
        setTimeout(function(){
            $('.showOne').removeClass('showError');
            $('#msg_li').empty().fadeOut().hide();

        }, 3000);
    }

    function validate() {

        var empName = $("#username").val();
        var logPsw = $("#password").val();
        if (empName == '') {
            showLoginMsg("管理员账号不能为空!");
            $("#username").focus();
            return false;
        }
        if (logPsw == '') {
            showLoginMsg("管理员密码不能为空!");
            $("#password").focus();
            return false;
        }

        return true;
    }



</script>